<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>后台-题目信息管理</title>
    <meta name="description" content="Charcoal is a free Bootstrap 4 UI kit build by @attacomsian at Wired Dots." />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--Bootstrap 4-->
    <link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>

<nav class="navbar navbar-expand-md navbar-dark fixed-top sticky-navigation">
    <a class="navbar-brand font-weight-bold" href="userManage.html">用户信息管理模块</a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#topMenu" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>

    <div class="collapse navbar-collapse" id="topMenu">

    </div>

    <a class="navbar-brand font-weight-bold" href="index.html">主页</a>
    <!--    只有管理员用户才会显示这个模块-->
    <!--    <a class="navbar-brand font-weight-bold" href="userManage.html">用户信息管理模块</a>-->
    <a class="navbar-brand font-weight-bold" href="javascript:void(0);"  onclick=logout()>注销</a>
</nav>



<!--components-->
<section class="my-5 pt-5">
    <div class="container">

        <!-- Tables  -->
        <div class="row mb-5" id="tables">
            <div class="col-sm-12">
                <br class="mt-3 mb-5">
                <h1 style="text-align: center">用户信息后台管理---修改用户信息</h1>

                <br>
                <br>

                <h2>用户名</h2>

                <br>
                <br>

                <!--  这是设置用户名-->
                <div class="title">
                    <input class="form-control" type="text" id="username" style="height: 40px">
                </div>

                <br>
                <br>

                <h2>用户邮箱</h2>

              <!--这是设置用户邮箱-->
                <div class="level">
                    <input  class="form-control" type="text" id="email" style="height: 40px">
                </div>

                <br>
                <br>



                <!-- Buttons  -->
                <div class="row mb-5" id="buttons">
                    <div class="col-sm-12">
                        <div class="row mt-4">
                            <div class="col-sm-6 pb-4" >
                                <button onclick=aaa() style="float: right" type="button" class="btn btn-primary" id="submitButton" >提交</button>
                            </div>
                        </div>
                    </div>
                </div>


            </div>
        </div>
    </div>
</section>



<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
<script src="js/app.js"></script>

<script src="https://cdn.bootcdn.net/ajax/libs/ace/1.2.9/ace.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/ace/1.2.9/ext-language_tools.js"></script>
<script>


    let username =document.querySelector("#username");
    let email = document.querySelector("#email");

    // 在页面加载的时候，尝试从服务器获取用户信息，通过 ajax 的方式来进行获取，然后将信息直接放到文本框中
    $.ajax({
        url:"usermanage/selectById"+location.search,
        type:"GET",
        success:function (data) {
            let user= data.data;
            console.log(user);
            username.value=user.username;
            email.value=user.email;
        },error:function () {
            //console.log(this.url);
             alert("服务器异常，加载失败!");
        }
    })



    // 修改的js函数
    function aaa() {

        if(username.value===""){
            alert("用户名不能为空!");
            return;
        }

        let body = {
            username:username.value,
            email:email.value
        }

        $.ajax({
            url:"usermanage/updateUser"+location.search,
            type: "POST",
            data:JSON.stringify(body),
            contentType:"application/json;charset=utf8",
            success:function (data) {
                alert(data.message);
            }
        });
    }

</script>
</body>
</html>
